<template>
  <div>
    <Title title="值班情况"></Title>
    <div class="right_center">
      <div demo-bg>
        <dv-scroll-board :config="config" @mouseover="mouseoverHandler" @click="clickHandler" />
      </div>
    </div>
  </div>
</template>

<script setup lang='ts'>
import { onMounted, reactive } from 'vue'
import Title from '../commont/Title.vue'
import { getzhi } from '../../request/index'
const config = reactive({
  header: ['序号', '姓名', '时间', '值班内容', '联系电话'],
  data: [['行1列1', '行1列2', '行1列3', '1']],
  index: false,
  columnWidth: [50],
  align: ['center']
})
onMounted(() => {
  getzhi().then((res) => {
    // console.log(res)
    config.data = res.data.data.result[0].map((item, index) => {
      return [item.eegs_id, item.eegs_name, item.eegs_time, item.eegs_dutyContent, item.eegs_phone]
    })
  })
})

const mouseoverHandler = (e: any) => {
  // console.log(e)
}

const clickHandler = (e: any) => {
  // console.log(e)
}
</script>

<style scoped lang='scss'>
.right_center {
  color: #fff;
  height: 350px;
  margin-top: 15px;
  display: flex;
}
.demo-bg {
  width: 100%;
  height: 100%;
}
.dv-scroll-board {
  width: 452px !important;
  height: 320px !important;
}
</style>